<template>
	<view class="detail-container">
		<!-- 状态栏占位 -->
		<view class="status-bar"></view>
		
		<!-- 导航栏 -->
		<view class="navbar">
			<view class="nav-left" @click="goBack">
				<text class="back-icon">←</text>
			</view>
			<text class="nav-title">报修详情</text>
			<view class="nav-right"></view>
		</view>
		
		<!-- 加载中 -->
		<view class="loading" v-if="loading">
			<text class="loading-text">加载中...</text>
		</view>

		<!-- 加载失败 -->
		<view class="error-state" v-else-if="!loading && !detail">
			<text class="error-icon">❌</text>
			<text class="error-text">加载失败，请重试</text>
			<button class="retry-btn" @click="loadDetail">重试</button>
		</view>

		<!-- 标签页导航和详情内容 -->
		<view v-else-if="!loading && detail" class="detail-wrapper">
			<!-- 标签页导航 -->
			<view class="tab-nav">
				<view class="tab-item" :class="{ active: activeTab === 'basic' }" @click="switchTab('basic')">
					<text class="tab-text">基本信息</text>
				</view>
				<view class="tab-item" :class="{ active: activeTab === 'fault' }" @click="switchTab('fault')">
					<text class="tab-text">故障信息</text>
				</view>
				<view class="tab-item" :class="{ active: activeTab === 'repair' }" @click="switchTab('repair')">
					<text class="tab-text">维修信息</text>
				</view>
			</view>

			<!-- 详情内容 -->
			<view class="detail-content">
			
			<!-- 基本信息标签页 -->
			<view class="tab-content" v-if="activeTab === 'basic'">
				<view class="info-card">
					<view class="card-header">
						<text class="card-title">基本信息</text>
					<view class="status-badge" :class="statusClass">
						<text class="status-text">{{ statusName }}</text>
					</view>
					</view>
					
					<view class="info-row">
						<text class="info-label">资产编号</text>
						<text class="info-value">{{ detail.assetNo || '-' }}</text>
					</view>
					
					<view class="info-row">
						<text class="info-label">设备类型</text>
						<text class="info-value">{{ getAssetTypeName(detail.assetType) || '设备' }}</text>
					</view>
					
					<view class="info-row">
						<text class="info-label">资产名称</text>
						<text class="info-value">{{ detail.assetName || '-' }}</text>
					</view>
					
					<view class="info-row">
						<text class="info-label">资产位置</text>
						<text class="info-value">{{ detail.location || '-' }}</text>
					</view>
					
					<view class="info-row">
						<text class="info-label">使用部门</text>
						<text class="info-value">{{ detail.deptName || '/' }}</text>
					</view>
				</view>
			</view>
			
			<!-- 故障信息标签页 -->
			<view class="tab-content" v-if="activeTab === 'fault'">
				<view class="info-card">
					<view class="card-header">
						<text class="card-title">故障信息</text>
					</view>
					
					<view class="info-row">
						<text class="info-label">发生时间</text>
						<text class="info-value">{{ detail.occurTime || '-' }}</text>
					</view>
					
					<view class="info-row">
						<text class="info-label">报修人</text>
						<text class="info-value">{{ detail.reporter || '-' }}</text>
					</view>
					
					<view class="info-row">
						<text class="info-label">报修类型</text>
						<text class="info-value">{{ detail.reportTypeName || '事前' }}</text>
					</view>
					
					<view class="info-row">
						<text class="info-label">故障类型</text>
						<text class="info-value">{{ detail.faultTypeName || '设备' }}</text>
					</view>
					
					<view class="info-row">
						<text class="info-label">紧急程度</text>
					<view v-if="detail.urgency && detail.urgencyName" class="urgency-badge" :style="{ backgroundColor: urgencyColor }">
						<text class="urgency-text">{{ detail.urgencyName }}</text>
					</view>
						<text v-else class="info-value">高</text>
					</view>
					
					<view class="info-row info-row-column">
						<text class="info-label">故障描述</text>
						<text class="info-value description">{{ detail.faultDescription || '请输入' }}</text>
					</view>
					
					<!-- 故障图片 -->
					<view class="info-row info-row-column" v-if="imageList.length > 0">
						<text class="info-label">故障图片</text>
						<view class="image-list">
							<view class="image-item" v-for="(image, index) in imageList" :key="index" @click="previewImage(index)">
								<image class="fault-image" :src="image" mode="aspectFill"></image>
							</view>
						</view>
					</view>
				</view>
			</view>
			
			<!-- 维修信息标签页 -->
			<view class="tab-content" v-if="activeTab === 'repair'">
				<view class="repair-info-card">
					<view class="repair-header">
						<text class="repair-title">维修信息</text>
					</view>
					
					<view class="repair-content">
						<view class="repair-field">
							<text class="repair-label">维修人</text>
							<text class="repair-value">{{ getAssigneeDisplayName(workOrderDetail) }}</text>
						</view>
						
						<view class="repair-field">
							<text class="repair-label">开始时间</text>
							<text class="repair-value">{{ workOrderDetail ? (workOrderDetail.startTime || '未开始') : '无数据' }}</text>
						</view>
						
						<view class="repair-field">
							<text class="repair-label">结束时间</text>
							<text class="repair-value">{{ workOrderDetail ? (workOrderDetail.endTime || '未结束') : '无数据' }}</text>
						</view>
						
						<view class="repair-field repair-field-full">
							<text class="repair-label">故障原因</text>
							<text class="repair-value repair-value-full">{{ workOrderDetail ? (workOrderDetail.faultCause || '待分析') : '无数据' }}</text>
						</view>
						
						<view class="repair-field repair-field-full">
							<text class="repair-label">故障对策</text>
							<text class="repair-value repair-value-full">{{ workOrderDetail ? (workOrderDetail.countermeasure || '待制定') : '无数据' }}</text>
						</view>
						
						<view class="repair-field">
							<text class="repair-label">维修状态</text>
							<text class="repair-value">{{ workOrderDetail ? (getStatusText(workOrderDetail.statusCode) || '未知') : '无数据' }}</text>
						</view>
						
						<view class="repair-field repair-field-full">
							<text class="repair-label">备注</text>
							<text class="repair-value repair-value-full">{{ workOrderDetail ? (workOrderDetail.remark || '无备注') : '无数据' }}</text>
						</view>
					</view>

				</view>
			</view>
		</view>
		
			<!-- 底部操作按钮 -->
			<!-- 草稿状态：删除+提交 -->
			<view class="bottom-actions" v-if="detail.status === 'DRAFT'">
				<button class="action-button delete-btn" @click="deleteDraft">删除草稿</button>
				<button class="action-button submit-btn" @click="submitDraft">提交报修</button>
			</view>

			<!-- 已确认状态：显示承认和拒绝承认按钮 -->
			<view class="bottom-actions" v-if="detail.status === 'CONFIRMED'">
				<button class="action-button acknowledge-btn" @click="acknowledgeRecord">承认</button>
				<button class="action-button reject-btn" @click="rejectRecord">拒绝承认</button>
			</view>

			<!-- 已承认状态：只显示删除按钮 -->
			<view class="bottom-actions" v-if="detail.status === 'ACKNOWLEDGED'">
				<button class="action-button delete-full" @click="deleteRecord">删除记录</button>
			</view>

			<!-- 待指派状态：显示接取按钮（仅限维修人员） -->
			<view class="bottom-actions" v-if="detail.status === 'PENDING_ASSIGN' && isMaintenanceWorker">
				<button class="action-button take-btn" @click="takeWorkOrder">接取任务</button>
			</view>

			<!-- 待执行状态：显示维修操作按钮（仅限维修人员） -->
			<view class="bottom-actions" v-if="(detail.status === 'PENDING_EXEC' || detail.status === 'ASSIGNED') && isMaintenanceWorker">
				<button class="action-button start-btn" @click="startRepair">执行维修</button>
				<button class="action-button add-work-btn" @click="addWorkTime">追加工时</button>
				<button class="action-button return-btn" @click="returnTask">退回</button>
			</view>


			<!-- 待料中状态：显示追加工时按钮（仅限维修人员） -->
			<view class="bottom-actions" v-if="detail.status === 'WAITING_MATERIAL' && isMaintenanceWorker">
				<button class="action-button add-work-btn" @click="addWorkTime">追加工时</button>
			</view>

			<!-- 追加工中状态：显示结束追加工按钮（仅限维修人员） -->
			<view class="bottom-actions" v-if="detail.status === 'EXTRA_PROCESSING' && isMaintenanceWorker">
				<button class="action-button end-extra-btn" @click="endExtraProcessing">结束追加工</button>
			</view>
		</view>

		<!-- 执行维修弹窗 -->
		<view v-if="showRepairModal" class="modal-overlay" @click="closeRepairModal">
			<view class="modal-content" @click.stop>
				<view class="modal-header">
					<text class="modal-title">维修信息填写</text>
					<text class="modal-close" @click="closeRepairModal">×</text>
				</view>
				
				<view class="modal-body">
					<view class="form-field">
						<text class="form-label">故障原因 <text class="required">*</text></text>
						<textarea 
							v-model="faultCause" 
							class="form-textarea" 
							placeholder="请输入故障原因"
							maxlength="500"
						></textarea>
					</view>
					
					<view class="form-field">
						<text class="form-label">故障对策 <text class="required">*</text></text>
						<textarea 
							v-model="countermeasure" 
							class="form-textarea" 
							placeholder="请输入故障对策"
							maxlength="500"
						></textarea>
					</view>
					
					<view class="form-field">
						<text class="form-label">开始时间 <text class="required">*</text></text>
						<picker 
							mode="multiSelector" 
							:value="startTimeIndex" 
							:range="timeRange" 
							@change="onStartTimeChange"
							@columnchange="onStartTimeColumnChange"
						>
							<view class="time-picker">
								<text class="time-display">{{ startTime || '请选择开始时间' }}</text>
								<text class="time-icon">📅</text>
							</view>
						</picker>
					</view>
					
					<view class="form-field">
						<text class="form-label">结束时间 <text class="required">*</text></text>
						<picker 
							mode="multiSelector" 
							:value="endTimeIndex" 
							:range="timeRange" 
							@change="onEndTimeChange"
							@columnchange="onEndTimeColumnChange"
						>
							<view class="time-picker">
								<text class="time-display">{{ endTime || '请选择结束时间' }}</text>
								<text class="time-icon">📅</text>
							</view>
						</picker>
					</view>

					<!-- 关联备件部分 -->
					<view class="form-field" v-if="relatedParts.length > 0">
						<text class="form-label">维修用料</text>
						
						<!-- 关联的备件列表 -->
						<view class="related-parts">
							<view class="part-item" v-for="(part, index) in relatedParts" :key="index">
								<view class="part-info">
									<text class="part-name">{{ part.partName }}</text>
									<text class="part-no">编号: {{ part.partNo }}</text>
									<text class="part-spec" v-if="part.specNo">规格: {{ part.specNo }}</text>
									<text class="part-type" v-if="part.partTypeName">类型: {{ part.partTypeName }}</text>
									<text class="part-stock">库存: {{ part.stockTotal || 0 }}</text>
								</view>
								<view class="part-quantity">
									<text class="quantity-label">出库数量:</text>
									<button class="quantity-btn" @click="decreaseQuantity(index)">-</button>
									<input 
										class="quantity-input" 
										v-model.number="part.quantity" 
										type="number" 
										min="0" 
										:max="part.stockTotal || 0"
										placeholder="0"
									/>
									<button class="quantity-btn" @click="increaseQuantity(index)">+</button>
								</view>
							</view>
						</view>
					</view>
					
					<!-- 无关联备件提示 -->
					<view class="form-field" v-else>
						<text class="form-label">维修用料</text>
						<view class="no-parts-tip">
							<text class="tip-text">该资产未关联备件，无需出库</text>
						</view>
					</view>
				</view>
				
				<view class="modal-footer">
					<button class="modal-btn cancel-btn" @click="closeRepairModal">取消</button>
					<button class="modal-btn confirm-btn" @click="completeRepair">完成维修</button>
				</view>
			</view>
		</view>

		</view>
</template>

<script>
	import { getFaultReport, submitFaultReport, delFaultReport, acknowledgeFaultReport, rejectFaultReport } from '@/api/repair/faultReport.js';
	import { getWorkOrder, updateWorkOrder } from '@/api/repair/workOrder.js';
	import { getEquipmentTypeList } from '@/api/asset.js';
	import { getUserInfo } from '@/utils/auth';
	import permissionManager from '@/utils/permission';
	
	export default {
		data() {
			return {
				reportNo: '',
				workNo: '',
				detail: null,
				workOrderDetail: null,
				loading: false,
				activeTab: 'basic', // 默认显示基本信息
				assetTypeDict: [], // 设备类型字典
				// 维修信息表单字段
				faultCause: '', // 故障原因
				countermeasure: '', // 故障对策
				startTime: '', // 开始时间
				endTime: '', // 结束时间
				showRepairModal: false, // 显示维修弹窗
				// 时间选择器数据
				startTimeIndex: [0, 0, 0, 0, 0, 0], // 开始时间索引
				endTimeIndex: [0, 0, 0, 0, 0, 0], // 结束时间索引
				timeRange: [[], [], [], [], [], []], // 时间范围数据
				// 关联备件数据
				relatedParts: [] // 关联的备件列表
			}
		},
		computed: {
			// 是否为维修人员
			isMaintenanceWorker() {
				const result = permissionManager.isMaintenanceWorker();
				return result;
			},
			
			// 图片列表
			imageList() {
				if (!this.detail || !this.detail.imageUrls) return [];
				
				try {
					let urls = [];
					if (typeof this.detail.imageUrls === 'string') {
						urls = JSON.parse(this.detail.imageUrls);
					} else if (Array.isArray(this.detail.imageUrls)) {
						urls = this.detail.imageUrls;
					}
					
					// 转换为完整的URL
					const minioBase = uni.getStorageSync('MINIO_BASE') || 'https://io.brightholdings.cn';
					const bucket = 'smart-maintenance';
					
					return urls.map(name => {
						if (/^https?:\/\//i.test(name)) return name;
						return `${minioBase.replace(/\/$/, '')}/${bucket}/${name}`;
					});
				} catch (error) {
					console.error('解析图片URL失败:', error);
					return [];
				}
			},
			
			// 状态类名
			statusClass() {
				return this.getStatusClass(this.detail?.status);
			},
			
			// 状态名称
			statusName() {
				return this.getStatusName(this.detail?.status);
			},
			
			// 紧急程度颜色
			urgencyColor() {
				return this.getUrgencyColor(this.detail?.urgency);
			},

		},
		onLoad(options) {
			if (options.reportNo) {
				this.reportNo = options.reportNo;
				this.workNo = options.workNo || '';
				this.loadDetail();
			} else {
				uni.showToast({
					title: '参数错误',
					icon: 'none'
				});
				setTimeout(() => {
					uni.navigateBack();
				}, 1500);
			}
		},
		methods: {
			// 返回上一页
			goBack() {
				uni.navigateBack();
			},
			
			// 加载详情
			async loadDetail() {
				this.loading = true;
				try {
					console.log('开始加载报修单详情，报修单号:', this.reportNo);
					console.log('当前token:', uni.getStorageSync('token'));
					console.log('当前baseURL:', uni.getStorageSync('BASE_URL') || 'http://127.0.0.1:8081');
					
					// 先加载报修单详情
					const detailRes = await getFaultReport(this.reportNo);
					console.log('报修单详情API响应:', detailRes);
					
					// 异步加载字典数据，不阻塞主流程
					this.loadAssetTypeDict().catch(error => {
						console.warn('设备类型字典加载失败，但不影响主流程:', error);
					});
					
					if (detailRes && detailRes.code === 200 && detailRes.data) {
						// 数据兼容性处理
						const data = detailRes.data;
						this.detail = {
							...data,
							assetNo: data.assetNo || data.asset_no,
							assetName: data.assetName || data.asset_name,
							faultDescription: data.faultDescription || data.fault_description
						};
						console.log('报修单详情加载成功:', this.detail);
					} else {
						console.error('报修单详情加载失败:', detailRes);
						this.detail = null; // 设置为空，触发错误状态显示
						return; // 提前返回，不继续执行后续逻辑
					}
					
					// 如果有维修单号，加载维修单详情
					if (this.workNo) {
						console.log('开始加载维修单详情，维修单号:', this.workNo);
						await this.loadWorkOrderDetail();
					} else {
						console.log('没有维修单号，无法加载维修单详情');
						// 如果没有维修单号，尝试从报修单中获取
						if (this.detail && this.detail.workOrderNo) {
							this.workNo = this.detail.workOrderNo;
							console.log('从报修单获取维修单号:', this.workNo);
							await this.loadWorkOrderDetail();
						}
					}
				} catch (error) {
					console.error('加载详情失败:', error);
					console.error('错误详情:', error.message);
					uni.showToast({
						title: '加载失败: ' + (error.message || '未知错误'),
						icon: 'none',
						duration: 3000
					});
					this.detail = null; // 设置为空，触发错误状态显示
				} finally {
					this.loading = false;
				}
			},
			
			// 加载维修单详情
			async loadWorkOrderDetail() {
				try {
					console.log('开始加载维修单详情，维修单号:', this.workNo);
					
					const res = await getWorkOrder(this.workNo);
					console.log('维修单详情API响应:', res);
					
					if (res && res.code === 200) {
						// 处理不同的响应格式
						if (Array.isArray(res.data)) {
							this.workOrderDetail = res.data[0] || null;
							console.log('维修单详情加载成功(数组格式):', this.workOrderDetail);
						} else if (res.data) {
							this.workOrderDetail = res.data;
							console.log('维修单详情加载成功(对象格式):', this.workOrderDetail);
						} else {
							console.warn('维修单详情数据为空');
							this.workOrderDetail = null;
						}
						
						// 不覆盖报修单状态，保持报修单原始状态
						// 维修单状态仅用于维修信息展示，不影响报修单状态显示
						if (this.workOrderDetail && this.detail) {
							// 将维修单状态存储到单独字段，不覆盖报修单状态
							this.detail.workOrderStatus = this.workOrderDetail.statusCode || this.workOrderDetail.status;
							console.log('维修单状态:', this.detail.workOrderStatus, '报修单状态:', this.detail.status);
						}
						
						// 如果有分配人ID，获取分配人姓名
						if (this.workOrderDetail && this.workOrderDetail.assigneeId) {
							console.log('开始加载分配人姓名，ID:', this.workOrderDetail.assigneeId);
							await this.loadAssigneeName(this.workOrderDetail.assigneeId);
						} else {
							console.log('没有分配人ID或维修单详情为空');
						}
					} else {
						console.warn('维修单详情加载失败:', res ? res.msg : '响应格式错误');
						this.workOrderDetail = null;
					}
				} catch (error) {
					console.error('加载维修单详情失败:', error);
					this.workOrderDetail = null;
				}
			},
			
			// 加载分配人姓名
			async loadAssigneeName(assigneeId) {
				try {
					const res = await uni.request({
						url: '/system/user/' + assigneeId,
						method: 'GET',
						header: {
							'Authorization': uni.getStorageSync('token')
						}
					});
					
					if (res.data && res.data.code === 200) {
						this.workOrderDetail.assigneeName = res.data.data.nickName || res.data.data.userName;
						console.log('分配人姓名加载成功:', this.workOrderDetail.assigneeName);
					}
				} catch (error) {
					console.error('加载分配人姓名失败:', error);
				}
			},
			
			// 加载设备类型字典
			async loadAssetTypeDict() {
				try {
					console.log('开始加载设备类型列表...');
					const res = await getEquipmentTypeList();

					console.log('设备类型API响应:', res);

					if (res && res.code === 200 && res.data && res.data.rows) {
						// 转换数据格式以匹配字典格式
						this.assetTypeDict = res.data.rows.map(item => ({
							dictCode: item.code,
							dictLabel: item.name,
							dictValue: item.code
						}));
						console.log('设备类型字典加载成功:', this.assetTypeDict);
						console.log('字典数据长度:', this.assetTypeDict.length);
						console.log('字典数据示例:', this.assetTypeDict[0]);
					} else {
						console.warn('设备类型API返回格式错误:', res);
						this.assetTypeDict = [];
					}
				} catch (error) {
					console.error('加载设备类型字典失败:', error);
					this.assetTypeDict = [];
				}
			},
			
			// 切换标签页
			switchTab(tab) {
				this.activeTab = tab;
			},
			
			// 获取设备类型中文名称
			getAssetTypeName(assetType) {
				if (!assetType) return '设备';

				// 如果字典数据还没加载完成，显示原始值
				if (!this.assetTypeDict || this.assetTypeDict.length === 0) {
					return assetType;
				}

				// 从字典数据中查找
				const dictItem = this.assetTypeDict.find(item =>
					item.dictCode === assetType || item.dictValue === assetType
				);

				return dictItem ? dictItem.dictLabel : assetType;
			},
			
            // 预加载报修单状态字典
            async loadRptOrderStatusDict() {
                try {
                    const res = await uni.request({
                        url: 'http://127.0.0.1:8081/system/status/rpt-order/list',
                        method: 'GET',
                        header: {
                            'Content-Type': 'application/json',
                            'Authorization': `Bearer ${uni.getStorageSync('token')}`
                        },
                        data: { pageNum: 1, pageSize: 9999, enabled: 1 }
                    });
                    const list = (res.data && (res.data.rows || res.data.data)) || [];
                    this._rptStatusMap = {};
                    list.forEach(it => { if (it && it.code) this._rptStatusMap[it.code] = it.name; });
                } catch (e) {
                    this._rptStatusMap = {};
                }
            },
            // 同步获取状态名称
            getStatusName(status) {
                if (this._rptStatusMap && this._rptStatusMap[status]) return this._rptStatusMap[status];
                return this.getFallbackStatusName(status);
            },
			
			// 兜底状态名称
			getFallbackStatusName(status) {
				const statusMap = {
					'DRAFT': '草稿',
					'PENDING_ASSIGN': '待分配',
					'ASSIGNED': '待接取',
					'ACKNOWLEDGED': '已承认',
					'PENDING_EXEC': '待维修',
					'IN_PROGRESS': '维修中',
					'IN_REPAIR': '维修中',
					'WAITING_MATERIAL': '待料中',
					'EXTRA_PROCESSING': '追加工中',
					'PENDING_CONFIRM': '待确认',
					'CONFIRMED': '已确认',
					'DONE': '已完成',
					'REJECTED': '拒绝确认'
				};
				return statusMap[status] || status;
			},
			
			// 获取状态文本（维修单状态）
			getStatusText(status) {
				const statusMap = {
					'DRAFT': '草稿',
					'PENDING_ASSIGN': '待分配',
					'ASSIGNED': '待接取',
					'PENDING_EXEC': '待维修',
					'IN_PROGRESS': '维修中',
					'IN_REPAIR': '维修中',
					'WAITING_MATERIAL': '待料中',
					'EXTRA_PROCESSING': '追加工中',
					'PENDING_CONFIRM': '待确认',
					'DONE': '已完成',
					'CONFIRMED': '已确认',
					'REJECTED': '拒绝确认',
					'ACKNOWLEDGED': '已承认'
				};
				return statusMap[status] || status || '未知';
			},
			
			// 获取备件类型中文名称
			getPartTypeName(partType) {
				const typeMap = {
					'BEARING': '轴承',
					'BELT': '皮带',
					'SEAL': '密封件',
					'FILTER': '过滤器',
					'VALVE': '阀门',
					'PUMP': '泵',
					'MOTOR': '电机',
					'GEAR': '齿轮',
					'BOLT': '螺栓',
					'NUT': '螺母',
					'WASHER': '垫片',
					'GASKET': '垫圈',
					'SPRING': '弹簧',
					'CHAIN': '链条',
					'CABLE': '电缆',
					'FUSE': '保险丝',
					'RELAY': '继电器',
					'SWITCH': '开关',
					'SENSOR': '传感器',
					'CONTROLLER': '控制器',
					'DISPLAY': '显示器',
					'KEYBOARD': '键盘',
					'MOUSE': '鼠标',
					'MONITOR': '监视器',
					'PRINTER': '打印机',
					'SCANNER': '扫描仪',
					'OTHER': '其他'
				};
				return typeMap[partType] || partType || '未知类型';
			},
			
			// 获取维修人显示名称
			getAssigneeDisplayName(workOrderDetail) {
				if (!workOrderDetail) return '无数据';
				
				// 优先显示姓名
				if (workOrderDetail.assigneeName) {
					return workOrderDetail.assigneeName;
				}
				
				// 如果有分配人ID但没有姓名，显示ID
				if (workOrderDetail.assigneeId) {
					return `用户${workOrderDetail.assigneeId}`;
				}
				
				return '未分配';
			},
			
			// 获取状态样式类
			getStatusClass(status) {
				const classMap = {
					'DRAFT': 'status-draft',
					'PENDING_ASSIGN': 'status-warning',
					'ASSIGNED': 'status-warning',
					'ACKNOWLEDGED': 'status-success',
					'PENDING_EXEC': 'status-danger',
					'IN_PROGRESS': 'status-primary',
					'IN_REPAIR': 'status-success',
					'WAITING_MATERIAL': 'status-warning',
					'EXTRA_PROCESSING': 'status-warning',
					'PENDING_CONFIRM': 'status-warning',
					'DONE': 'status-success',
					'CONFIRMED': 'status-success',
					'REJECTED': 'status-danger'
				};
				return classMap[status] || 'status-info';
			},
			
			// 获取紧急程度颜色
			getUrgencyColor(urgency) {
				const colorMap = {
					'URGENT_001': '#ff4444',
					'URGENT_002': '#ff9800',
					'URGENT_003': '#2196f3'
				};
				return colorMap[urgency] || '#999';
			},
			
			// 预览图片
			previewImage(index) {
				uni.previewImage({
					urls: this.imageList,
					current: index
				});
			},


			// 接取维修任务
			async takeWorkOrder() {
				try {
					console.log('开始接取维修任务:', this.workNo);

					// 获取当前用户信息
					const userInfo = getUserInfo();
					if (!userInfo?.user?.userId) {
						uni.showToast({
							title: '用户信息获取失败',
							icon: 'none'
						});
						return;
					}

					// 调用接取任务API
					const res = await updateWorkOrder({
						workNo: this.workNo,
						assigneeId: userInfo.user.userId,
						statusCode: 'ASSIGNED'
					});

					if (res && res.code === 200) {
						uni.showToast({
							title: '任务接取成功',
							icon: 'success'
						});

						// 立即更新本地状态
						if (this.detail) {
							this.detail.status = 'ASSIGNED';
							this.detail.statusCode = 'ASSIGNED';
							this.detail.assigneeId = userInfo.user.userId;
							this.detail.assigneeName = userInfo.name;
						}

						// 重新加载详情数据
						this.loadDetail();
					} else {
						uni.showToast({
							title: res?.msg || '接取任务失败',
							icon: 'none'
						});
					}
				} catch (error) {
					console.error('接取维修任务失败:', error);
					uni.showToast({
						title: '接取任务失败',
						icon: 'none'
					});
				}
			},

			// 开始执行维修
			async startRepair() {
				try {
					console.log('开始执行维修:', this.workNo);
					
					// 获取当前用户信息
					const userInfo = getUserInfo();
					if (!userInfo?.user?.userId) {
						uni.showToast({
							title: '用户信息获取失败',
							icon: 'none'
						});
						return;
					}

					// 不改变状态，直接弹出维修弹窗
					this.executeRepair();
				} catch (error) {
					console.error('开始执行维修失败:', error);
					uni.showToast({
						title: '开始维修失败',
						icon: 'none'
					});
				}
			},

			// 追加工时
			async addWorkTime() {
				try {
					console.log('开始追加工时:', this.workNo);
					
					// 获取当前用户信息
					const userInfo = getUserInfo();
					if (!userInfo?.user?.userId) {
						uni.showToast({
							title: '用户信息获取失败',
							icon: 'none'
						});
						return;
					}

					// 调用追加工时API
					const workOrderRes = await getWorkOrder(this.workNo);
					let res = null;
					
					if (workOrderRes && workOrderRes.code === 200) {
						const workOrderData = workOrderRes.data;
						
						// 保存原始状态，设置为追加工状态
						workOrderData.originalStatus = workOrderData.statusCode;
						workOrderData.statusCode = 'EXTRA_PROCESSING';
						
						res = await updateWorkOrder(workOrderData);
					} else {
						throw new Error('获取维修单详情失败');
					}

					if (res && res.code === 200) {
						uni.showToast({
							title: '开始追加工时',
							icon: 'success'
						});
						
						// 延迟重新加载详情，确保服务器数据已更新
						setTimeout(() => {
							this.loadDetail();
							// 触发维修列表刷新事件
							uni.$emit('refreshRepairList');
						}, 500);
					} else {
						uni.showToast({
							title: res?.msg || '追加工时失败',
							icon: 'none'
						});
					}
				} catch (error) {
					console.error('追加工时失败:', error);
					uni.showToast({
						title: '追加工时失败',
						icon: 'none'
					});
				}
			},

			// 执行维修（打开弹窗）
			executeRepair() {
				// 清空表单数据
				this.faultCause = '';
				this.countermeasure = '';
				this.startTime = '';
				this.endTime = '';
				
				// 初始化时间选择器数据
				this.initTimeRange();
				
				// 加载关联备件
				this.loadRelatedParts();
				
				// 显示弹窗
				this.showRepairModal = true;
			},

			// 关闭维修弹窗
			closeRepairModal() {
				this.showRepairModal = false;
			},

			// 加载关联备件
			async loadRelatedParts() {
				try {
					if (this.detail && this.detail.assetNo) {
						console.log('开始加载资产关联备件，资产编号:', this.detail.assetNo);
						
						// 使用封装的API调用备件列表
						const { listPart } = await import('@/api/inventory/part.js');
						const res = await listPart({
							pageNum: 1,
							pageSize: 9999,
							assetNo: this.detail.assetNo
						});
						
						console.log('备件列表API响应:', res);
						
						if (res && res.code === 200) {
							let parts = res.rows || [];
							
							// 过滤出关联当前资产的备件
							parts = parts.filter(part => {
								const json = part.associatedAssetsJson || part.associatedAssets || part.assetNos || '';
								try {
									if (!json) return false;
									const arr = Array.isArray(json) ? json : JSON.parse(json);
									return (arr || []).some(asset => 
										String(asset.assetNo || asset) === String(this.detail.assetNo)
									);
								} catch(e) {
									return String(json).split(',').map(s => s.trim()).includes(String(this.detail.assetNo));
								}
							});
							
							// 转换为需要的格式
							this.relatedParts = parts.map(part => ({
								partNo: part.partNo || part.code || part.sn || '',
								partName: part.partName || part.name || '',
								specNo: part.specNo || part.model || part.specModel || '',
								partTypeName: this.getPartTypeName(part.partTypeName || part.partTypeCode || part.type || ''),
								stockTotal: part.stock || part.stockTotal || part.totalStock || part.qty || 0,
								warehouseCode: part.warehouseCode || part.warehouse || part.whCode || '',
								quantity: 0 // 初始出库数量为0
							}));
							
							console.log('关联备件加载成功:', this.relatedParts);
						} else {
							console.warn('获取备件列表失败:', res?.msg || res?.message || '未知错误');
							this.relatedParts = [];
						}
					} else {
						console.log('没有资产编号，无法加载关联备件');
						this.relatedParts = [];
					}
				} catch (error) {
					console.error('加载关联备件失败:', error);
					this.relatedParts = [];
				}
			},

			// 增加数量
			increaseQuantity(index) {
				if (this.relatedParts[index].quantity < this.relatedParts[index].stockTotal) {
					this.relatedParts[index].quantity++;
				}
			},

			// 减少数量
			decreaseQuantity(index) {
				if (this.relatedParts[index].quantity > 0) {
					this.relatedParts[index].quantity--;
				}
			},

			// 处理备件出库
			async processPartsOutbound() {
				try {
					// 筛选出需要出库的备件（数量大于0）
					const outboundParts = this.relatedParts.filter(part => part.quantity > 0);
					
					if (outboundParts.length === 0) {
						console.log('无需出库备件');
						return;
					}

					console.log('开始处理备件出库:', outboundParts);

					// 调用备件出库API
					const { createPartsOutbound } = await import('@/api/inventory/part.js');
					
					// 构建出库单数据
					const outboundData = {
						txType: 'OUTBOUND', // 出库类型
						bizRefType: 'REPAIR', // 业务类型：维修出库
						warehouseCode: outboundParts[0].warehouseCode || 'DEFAULT', // 使用第一个备件的仓库
						remark: `维修单${this.workNo}备件出库`,
						partList: outboundParts.map(part => ({
							partNo: part.partNo,
							quantity: part.quantity,
							warehouseCode: part.warehouseCode || 'DEFAULT'
						}))
					};

					console.log('出库单数据:', outboundData);

					const outboundResult = await createPartsOutbound(outboundData);

					if (outboundResult && outboundResult.code === 200) {
						console.log('备件出库成功:', outboundResult);
						
						uni.showToast({
							title: `已出库 ${outboundParts.length} 种备件`,
							icon: 'success'
						});
					} else {
						throw new Error(outboundResult?.msg || '备件出库失败');
					}

				} catch (error) {
					console.error('备件出库失败:', error);
					uni.showToast({
						title: error.message || '备件出库失败',
						icon: 'none'
					});
				}
			},

			// 初始化时间范围数据
			initTimeRange() {
				const now = new Date();
				const currentYear = now.getFullYear();
				const currentMonth = now.getMonth() + 1;
				const currentDay = now.getDate();
				const currentHour = now.getHours();
				const currentMinute = now.getMinutes();
				const currentSecond = now.getSeconds();

				// 年份：当前年份前后5年
				const years = [];
				for (let i = currentYear - 5; i <= currentYear + 5; i++) {
					years.push(i.toString());
				}

				// 月份：1-12
				const months = [];
				for (let i = 1; i <= 12; i++) {
					months.push(i.toString().padStart(2, '0'));
				}

				// 日期：1-31
				const days = [];
				for (let i = 1; i <= 31; i++) {
					days.push(i.toString().padStart(2, '0'));
				}

				// 小时：0-23
				const hours = [];
				for (let i = 0; i <= 23; i++) {
					hours.push(i.toString().padStart(2, '0'));
				}

				// 分钟：0-59
				const minutes = [];
				for (let i = 0; i <= 59; i++) {
					minutes.push(i.toString().padStart(2, '0'));
				}

				// 秒：0-59
				const seconds = [];
				for (let i = 0; i <= 59; i++) {
					seconds.push(i.toString().padStart(2, '0'));
				}

				this.timeRange = [years, months, days, hours, minutes, seconds];

				// 设置默认索引为当前时间
				this.startTimeIndex = [
					years.indexOf(currentYear.toString()),
					months.indexOf(currentMonth.toString().padStart(2, '0')),
					days.indexOf(currentDay.toString().padStart(2, '0')),
					hours.indexOf(currentHour.toString().padStart(2, '0')),
					minutes.indexOf(currentMinute.toString().padStart(2, '0')),
					seconds.indexOf(currentSecond.toString().padStart(2, '0'))
				];

				this.endTimeIndex = [...this.startTimeIndex];
			},

			// 开始时间选择器列变化
			onStartTimeColumnChange(e) {
				const column = e.detail.column;
				const value = e.detail.value;
				this.startTimeIndex[column] = value;
			},

			// 开始时间选择器确认
			onStartTimeChange(e) {
				const values = e.detail.value;
				this.startTimeIndex = values;
				const year = this.timeRange[0][values[0]];
				const month = this.timeRange[1][values[1]];
				const day = this.timeRange[2][values[2]];
				const hour = this.timeRange[3][values[3]];
				const minute = this.timeRange[4][values[4]];
				const second = this.timeRange[5][values[5]];
				
				this.startTime = `${year}-${month}-${day} ${hour}:${minute}:${second}`;
			},

			// 结束时间选择器列变化
			onEndTimeColumnChange(e) {
				const column = e.detail.column;
				const value = e.detail.value;
				this.endTimeIndex[column] = value;
			},

			// 结束时间选择器确认
			onEndTimeChange(e) {
				const values = e.detail.value;
				this.endTimeIndex = values;
				const year = this.timeRange[0][values[0]];
				const month = this.timeRange[1][values[1]];
				const day = this.timeRange[2][values[2]];
				const hour = this.timeRange[3][values[3]];
				const minute = this.timeRange[4][values[4]];
				const second = this.timeRange[5][values[5]];
				
				this.endTime = `${year}-${month}-${day} ${hour}:${minute}:${second}`;
			},

			// 完成维修
			async completeRepair() {
				// 1. 验证必填字段
				if (!this.validateRequiredFields()) {
					uni.showToast({
						title: '请填写所有必填字段',
						icon: 'none'
					});
					return;
				}

				// 2. 验证时间逻辑
				if (!this.validateTimeLogic()) {
					uni.showToast({
						title: '结束时间不能早于开始时间',
						icon: 'none'
					});
					return;
				}

				uni.showModal({
					title: '完成维修',
					content: '确定要完成这个维修任务吗？完成后将进入待确认状态。',
					success: async (res) => {
						if (res.confirm) {
							try {
								console.log('完成维修:', this.workNo);
								
								// 获取当前用户信息
								const userInfo = getUserInfo();
								if (!userInfo?.user?.userId) {
									uni.showToast({
										title: '用户信息获取失败',
										icon: 'none'
									});
									return;
								}

								// 调用完成维修API
								const workOrderRes = await getWorkOrder(this.workNo);
								let result = null;
								
								if (workOrderRes && workOrderRes.code === 200) {
									const workOrderData = workOrderRes.data;
									
									// 更新状态为待确认（而不是DONE）
									workOrderData.statusCode = 'PENDING_CONFIRM';
									workOrderData.faultCause = this.faultCause;
									workOrderData.countermeasure = this.countermeasure;
									workOrderData.startTime = this.startTime;
									workOrderData.endTime = this.endTime;
									
									result = await updateWorkOrder(workOrderData);
									
									// 如果有备件需要出库，处理备件出库
									if (this.relatedParts && this.relatedParts.length > 0) {
										await this.processPartsOutbound();
									}
								} else {
									throw new Error('获取维修单详情失败');
								}

								if (result && result.code === 200) {
									uni.showToast({
										title: '维修完成，等待确认',
										icon: 'success'
									});
									
									// 关闭弹窗
									this.showRepairModal = false;
									
									// 更新本地状态
									if (this.detail) {
										this.detail.status = 'PENDING_CONFIRM';
										this.detail.statusCode = 'PENDING_CONFIRM';
									}
									
									// 重新加载详情
									this.loadDetail();
									
									// 触发维修列表刷新事件
									uni.$emit('refreshRepairList');
								} else {
									uni.showToast({
										title: result?.msg || '完成维修失败',
										icon: 'none'
									});
								}
							} catch (error) {
								console.error('完成维修失败:', error);
								uni.showToast({
									title: '完成维修失败',
									icon: 'none'
								});
							}
						}
					}
				});
			},

			// 验证必填字段
			validateRequiredFields() {
				return this.faultCause.trim() !== '' && 
					   this.countermeasure.trim() !== '' && 
					   this.startTime !== '' && 
					   this.endTime !== '';
			},

			// 验证时间逻辑
			validateTimeLogic() {
				if (!this.startTime || !this.endTime) {
					return true; // 如果时间未填写，由必填验证处理
				}
				const start = new Date(this.startTime);
				const end = new Date(this.endTime);
				return end >= start;
			},

			// 结束追加工
			async endExtraProcessing() {
				try {
					console.log('结束追加工:', this.workNo);
					
					// 获取当前用户信息
					const userInfo = getUserInfo();
					if (!userInfo?.user?.userId) {
						uni.showToast({
							title: '用户信息获取失败',
							icon: 'none'
						});
						return;
					}

					// 调用结束追加工API
					const workOrderRes = await getWorkOrder(this.workNo);
					let res = null;
					let workOrderData = null;
					
					if (workOrderRes && workOrderRes.code === 200) {
						workOrderData = workOrderRes.data;
						
						// 恢复原始状态，默认为PENDING_EXEC状态（待维修）
						const originalStatus = workOrderData.originalStatus || 'PENDING_EXEC';
						workOrderData.statusCode = originalStatus;
						workOrderData.originalStatus = null;
						
						res = await updateWorkOrder(workOrderData);
					} else {
						throw new Error('获取维修单详情失败');
					}

					if (res && res.code === 200) {
						uni.showToast({
							title: '追加工结束',
							icon: 'success'
						});
						
						console.log('结束追加工成功，准备重新加载详情，恢复状态为:', workOrderData.statusCode);
						
						// 延迟重新加载详情，确保服务器数据已更新
						setTimeout(() => {
							console.log('开始重新加载详情...');
							this.loadDetail();
							// 触发维修列表刷新事件
							uni.$emit('refreshRepairList');
						}, 1000);
					} else {
						uni.showToast({
							title: res?.msg || '结束追加工失败',
							icon: 'none'
						});
					}
				} catch (error) {
					console.error('结束追加工失败:', error);
					uni.showToast({
						title: '结束追加工失败',
						icon: 'none'
					});
				}
			},

			// 退回任务
			async returnTask() {
				uni.showModal({
					title: '退回任务',
					content: '确定要退回这个维修任务吗？',
					success: async (res) => {
						if (res.confirm) {
							try {
								console.log('退回任务:', this.workNo);
								
								// 获取当前用户信息
								const userInfo = getUserInfo();
								if (!userInfo?.user?.userId) {
									uni.showToast({
										title: '用户信息获取失败',
										icon: 'none'
									});
									return;
								}

								// 调用退回任务API
								const workOrderRes = await getWorkOrder(this.workNo);
								let result = null;
								
								if (workOrderRes && workOrderRes.code === 200) {
									const workOrderData = workOrderRes.data;
									
									// 更新状态为待分配
									workOrderData.statusCode = 'PENDING_ASSIGN';
									workOrderData.assigneeId = null;
									workOrderData.assigneeName = null;
									
									result = await updateWorkOrder(workOrderData);
								} else {
									throw new Error('获取维修单详情失败');
								}

								if (result && result.code === 200) {
									uni.showToast({
										title: '任务退回成功',
										icon: 'success'
									});
									
									// 延迟返回维修列表页面并刷新
									setTimeout(() => {
										uni.navigateBack({
											delta: 1,
											success: () => {
												// 通过事件总线通知列表页面刷新
												uni.$emit('refreshRepairList');
											},
											fail: () => {
												// 如果返回失败，直接跳转到维修列表页面
												uni.reLaunch({
													url: '/pages/repair/my-repairs'
												});
											}
										});
									}, 1500);
								} else {
									uni.showToast({
										title: result?.msg || '退回任务失败',
										icon: 'none'
									});
								}
							} catch (error) {
								console.error('退回任务失败:', error);
								uni.showToast({
									title: '退回任务失败',
									icon: 'none'
								});
							}
						}
					}
				});
			},

			// 提交草稿
			async submitDraft() {
				uni.showModal({
					title: '确认提交',
					content: '确定要提交这个报修单吗？',
					success: async (res) => {
						if (res.confirm) {
							try {
								uni.showLoading({
									title: '提交中...'
								});
								
								await submitFaultReport(this.reportNo);
								
								uni.hideLoading();
								uni.showToast({
									title: '提交成功',
									icon: 'success'
								});
								
								// 设置刷新标记
								uni.setStorageSync('needRefreshDrafts', true);
								uni.setStorageSync('needRefreshFaultReport', true);
								
								// 返回上一页
								setTimeout(() => {
									uni.navigateBack();
								}, 1500);
							} catch (error) {
								uni.hideLoading();
								console.error('提交失败:', error);
								
								const errorMsg = error.message || error.msg || '提交失败';
								uni.showModal({
									title: '提交失败',
									content: errorMsg,
									showCancel: false,
									confirmText: '知道了'
								});
							}
						}
					}
				});
			},
			
		// 删除草稿
		async deleteDraft() {
			uni.showModal({
				title: '确认删除',
				content: '确定要删除这个草稿吗？',
				success: async (res) => {
					if (res.confirm) {
						try {
							uni.showLoading({
								title: '删除中...'
							});
							
							await delFaultReport(this.reportNo);
							
							uni.hideLoading();
							uni.showToast({
								title: '删除成功',
								icon: 'success'
							});
							
							// 设置刷新标记
							uni.setStorageSync('needRefreshDrafts', true);
							
							// 返回上一页
							setTimeout(() => {
								uni.navigateBack();
							}, 1500);
						} catch (error) {
							uni.hideLoading();
							console.error('删除失败:', error);
							
							const errorMsg = error.message || error.msg || '删除失败';
							uni.showModal({
								title: '删除失败',
								content: errorMsg,
								showCancel: false,
								confirmText: '知道了'
							});
						}
					}
				}
			});
		},
		
		// 删除报修记录（已承认状态）
		async deleteRecord() {
			uni.showModal({
				title: '确认删除',
				content: '确定要删除这条报修记录吗？删除后将无法恢复。',
				success: async (res) => {
					if (res.confirm) {
						try {
							uni.showLoading({
								title: '删除中...'
							});
							
							await delFaultReport(this.reportNo);
							
							uni.hideLoading();
							uni.showToast({
								title: '删除成功',
								icon: 'success'
							});
							
							// 设置刷新标记
							uni.setStorageSync('needRefreshRecords', true);
							
							// 返回上一页
							setTimeout(() => {
								uni.navigateBack();
							}, 1500);
						} catch (error) {
							uni.hideLoading();
							console.error('删除失败:', error);
							
							const errorMsg = error.message || error.msg || '删除失败';
							uni.showModal({
								title: '删除失败',
								content: errorMsg,
								showCancel: false,
								confirmText: '知道了'
							});
						}
					}
				}
			});
		},
		
		// 承认报修记录
		async acknowledgeRecord() {
			uni.showModal({
				title: '确认承认',
				content: '确定要承认这条报修记录吗？',
				success: async (res) => {
					if (res.confirm) {
						try {
							uni.showLoading({
								title: '承认中...'
							});
							
							await acknowledgeFaultReport(this.reportNo);
							
							uni.hideLoading();
							uni.showToast({
								title: '承认成功',
								icon: 'success'
							});
							
							// 设置刷新标记
							uni.setStorageSync('needRefreshRecords', true);
							
							// 返回上一页并刷新
							setTimeout(() => {
								uni.navigateBack();
							}, 1500);
						} catch (error) {
							uni.hideLoading();
							console.error('承认失败:', error);
							
							const errorMsg = error.message || error.msg || '承认失败';
							uni.showModal({
								title: '承认失败',
								content: errorMsg,
								showCancel: false,
								confirmText: '知道了'
							});
						}
					}
				}
			});
		},
		
		// 拒绝承认报修记录
		async rejectRecord() {
			uni.showModal({
				title: '确认拒绝',
				content: '确定要拒绝承认这条报修记录吗？',
				success: async (res) => {
					if (res.confirm) {
						try {
							uni.showLoading({
								title: '拒绝中...'
							});
							
							await rejectFaultReport(this.reportNo);
							
							uni.hideLoading();
							uni.showToast({
								title: '拒绝成功',
								icon: 'success'
							});
							
							// 设置刷新标记
							uni.setStorageSync('needRefreshRecords', true);
							
							// 返回上一页并刷新
							setTimeout(() => {
								uni.navigateBack();
							}, 1500);
						} catch (error) {
							uni.hideLoading();
							console.error('拒绝失败:', error);
							
							const errorMsg = error.message || error.msg || '拒绝失败';
							uni.showModal({
								title: '拒绝失败',
								content: errorMsg,
								showCancel: false,
								confirmText: '知道了'
							});
						}
					}
				}
			});
		}
	}
}
</script>

<style>
	.detail-container {
		min-height: 100vh;
		background-color: #f5f5f7;
		padding-bottom: 120rpx;
	}
	
	.status-bar {
		height: 64rpx;
	}
	
	.navbar {
		display: flex;
		align-items: center;
		justify-content: space-between;
		height: 88rpx;
		background-color: white;
		padding: 0 30rpx;
		border-bottom: 1rpx solid #e5e5e5;
	}
	
	.nav-left {
		width: 60rpx;
		height: 60rpx;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	
	.back-icon {
		font-size: 36rpx;
		color: #333;
	}
	
	.nav-title {
		font-size: 36rpx;
		font-weight: bold;
		color: #333;
	}
	
	.nav-right {
		width: 60rpx;
	}
	
	.loading {
		display: flex;
		justify-content: center;
		align-items: center;
		padding: 100rpx 0;
	}
	
	.loading-text {
		font-size: 28rpx;
		color: #999;
	}

	/* 错误状态样式 */
	.error-state {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		padding: 100rpx 40rpx;
		min-height: 400rpx;
	}

	.error-icon {
		font-size: 120rpx;
		color: #ff4444;
		margin-bottom: 40rpx;
	}

	.error-text {
		font-size: 32rpx;
		color: #666;
		margin-bottom: 60rpx;
		text-align: center;
	}

	.retry-btn {
		background-color: #007aff;
		color: white;
		border: none;
		border-radius: 12rpx;
		padding: 24rpx 48rpx;
		font-size: 32rpx;
		min-width: 200rpx;
	}

	/* 详情包装器 */
	.detail-wrapper {
		min-height: 100vh;
		background-color: #f5f5f5;
	}
	
	.tab-nav {
		display: flex;
		background-color: white;
		border-bottom: 1rpx solid #e5e5e5;
	}
	
	.tab-item {
		flex: 1;
		display: flex;
		justify-content: center;
		align-items: center;
		height: 88rpx;
		position: relative;
	}
	
	.tab-item.active {
		border-bottom: 4rpx solid #007aff;
	}
	
	.tab-text {
		font-size: 28rpx;
		color: #666;
	}
	
	.tab-item.active .tab-text {
		color: #007aff;
		font-weight: bold;
	}
	
	.tab-content {
		padding: 20rpx;
	}
	
	.detail-content {
		padding: 20rpx;
	}
	
	.info-card {
		background-color: white;
		border-radius: 20rpx;
		padding: 30rpx;
		margin-bottom: 20rpx;
		box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.1);
	}
	
	.card-header {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 30rpx;
		padding-bottom: 20rpx;
		border-bottom: 1rpx solid #f0f0f0;
	}
	
	.card-title {
		font-size: 32rpx;
		font-weight: bold;
		color: #333;
	}
	
	.status-badge {
		padding: 8rpx 16rpx;
		border-radius: 20rpx;
	}
	
	.status-text {
		font-size: 24rpx;
		font-weight: bold;
		color: white;
	}
	
	.status-draft {
		background-color: #ff9800;
	}
	
	.status-warning {
		background-color: #ff9800;
	}
	
	.status-danger {
		background-color: #f44336;
	}
	
	.status-primary {
		background-color: #2196f3;
	}
	
	.status-success {
		background-color: #4caf50;
	}
	
	.status-info {
		background-color: #999;
	}
	
	.info-row {
		display: flex;
		align-items: center;
		margin-bottom: 20rpx;
	}
	
	.info-row:last-child {
		margin-bottom: 0;
	}
	
	.info-row-column {
		flex-direction: column;
		align-items: flex-start;
	}
	
	.info-label {
		font-size: 26rpx;
		color: #666;
		width: 160rpx;
		flex-shrink: 0;
	}
	
	.info-row-column .info-label {
		width: 100%;
		margin-bottom: 15rpx;
	}
	
	.info-value {
		font-size: 28rpx;
		color: #333;
		flex: 1;
		word-break: break-all;
	}
	
	.info-value.description {
		width: 100%;
		line-height: 1.6;
	}
	
	.urgency-badge {
		padding: 6rpx 16rpx;
		border-radius: 15rpx;
	}
	
	.urgency-text {
		font-size: 24rpx;
		color: white;
		font-weight: bold;
	}
	
	.image-list {
		display: flex;
		flex-wrap: wrap;
		gap: 20rpx;
		width: 100%;
	}
	
	.image-item {
		width: 200rpx;
		height: 200rpx;
		border-radius: 10rpx;
		overflow: hidden;
		border: 1rpx solid #e9ecef;
	}
	
	.fault-image {
		width: 100%;
		height: 100%;
	}
	
	.bottom-actions {
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		display: flex;
		background-color: white;
		padding: 20rpx;
		border-top: 1rpx solid #e5e5e5;
		box-shadow: 0 -4rpx 20rpx rgba(0, 0, 0, 0.1);
	}
	
	.action-button {
		flex: 1;
		height: 80rpx;
		font-size: 32rpx;
		font-weight: bold;
		border-radius: 15rpx;
		border: none;
		margin: 0 10rpx;
	}
	
	.delete-btn {
		background-color: white;
		color: #f44336;
		border: 2rpx solid #f44336;
	}
	
	.submit-btn {
		background-color: #007aff;
		color: white;
	}
	
	.delete-full {
		background-color: #f44336;
		color: white;
		flex: 1;
	}

	.take-btn {
		background-color: #67c23a;
		color: white;
		flex: 1;
	}

	.start-btn {
		background-color: #409eff;
		color: white;
		flex: 1;
		margin-right: 10rpx;
	}

	.add-work-btn {
		background-color: #e6a23c;
		color: white;
		flex: 1;
		margin: 0 5rpx;
	}

	.return-btn {
		background-color: #f56c6c;
		color: white;
		flex: 1;
		margin-left: 10rpx;
	}

	.acknowledge-btn {
		background-color: #67c23a;
		color: white;
		flex: 1;
		margin-right: 10rpx;
	}

	.reject-btn {
		background-color: #f56c6c;
		color: white;
		flex: 1;
		margin-left: 10rpx;
	}

	.complete-btn {
		background-color: #67c23a;
		color: white;
		flex: 1;
		margin-right: 10rpx;
	}

	.execute-btn {
		background-color: #409eff;
		color: white;
		flex: 1;
		margin-right: 10rpx;
	}

	.end-extra-btn {
		background-color: #909399;
		color: white;
		flex: 1;
	}

	/* 维修信息表单样式 */
	.repair-form {
		background: white;
		border-radius: 12rpx;
		padding: 30rpx;
		margin-top: 20rpx;
		box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
	}

	.form-title {
		font-size: 32rpx;
		font-weight: bold;
		color: #333;
		margin-bottom: 30rpx;
		text-align: center;
	}

	.form-field {
		margin-bottom: 30rpx;
	}

	.form-label {
		display: block;
		font-size: 28rpx;
		color: #333;
		margin-bottom: 15rpx;
		font-weight: 500;
	}

	.required {
		color: #ff4757;
		margin-left: 5rpx;
	}

	.form-textarea {
		width: 100%;
		min-height: 120rpx;
		padding: 20rpx;
		border: 2rpx solid #e1e8ed;
		border-radius: 8rpx;
		font-size: 28rpx;
		color: #333;
		background: #fafbfc;
		box-sizing: border-box;
	}

	.form-textarea:focus {
		border-color: #409eff;
		background: white;
	}

	.form-input {
		width: 100%;
		height: 80rpx;
		padding: 0 20rpx;
		border: 2rpx solid #e1e8ed;
		border-radius: 8rpx;
		font-size: 28rpx;
		color: #333;
		background: #fafbfc;
		box-sizing: border-box;
	}

	.form-input:focus {
		border-color: #409eff;
		background: white;
	}

	/* 弹窗样式 */
	.modal-overlay {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background: rgba(0, 0, 0, 0.5);
		display: flex;
		align-items: center;
		justify-content: center;
		z-index: 1000;
	}

	.modal-content {
		background: white;
		border-radius: 16rpx;
		width: 90%;
		max-width: 600rpx;
		max-height: 80vh;
		overflow: hidden;
		box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.3);
	}

	.modal-header {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 30rpx;
		border-bottom: 1rpx solid #e1e8ed;
		background: #f8f9fa;
	}

	.modal-title {
		font-size: 32rpx;
		font-weight: bold;
		color: #333;
	}

	.modal-close {
		font-size: 40rpx;
		color: #999;
		cursor: pointer;
		line-height: 1;
	}

	.modal-body {
		padding: 30rpx;
		max-height: 60vh;
		overflow-y: auto;
	}

	.modal-footer {
		display: flex;
		padding: 30rpx;
		border-top: 1rpx solid #e1e8ed;
		background: #f8f9fa;
		gap: 20rpx;
	}

	.modal-btn {
		flex: 1;
		height: 80rpx;
		border-radius: 8rpx;
		font-size: 28rpx;
		border: none;
		cursor: pointer;
	}

	.cancel-btn {
		background: #f5f5f5;
		color: #666;
	}

	.confirm-btn {
		background: #67c23a;
		color: white;
	}

	/* 时间选择器样式 */
	.time-picker {
		display: flex;
		align-items: center;
		justify-content: space-between;
		height: 80rpx;
		padding: 0 20rpx;
		border: 2rpx solid #e1e8ed;
		border-radius: 8rpx;
		background: #fafbfc;
		cursor: pointer;
		transition: all 0.3s ease;
	}

	.time-picker:active {
		border-color: #409eff;
		background: white;
	}

	.time-display {
		flex: 1;
		font-size: 28rpx;
		color: #333;
	}

	.time-display:empty::before {
		content: '请选择时间';
		color: #999;
	}

	.time-icon {
		font-size: 32rpx;
		color: #409eff;
		margin-left: 10rpx;
	}

	/* 关联备件样式 */
	.related-parts {
		margin-top: 20rpx;
	}

	.part-item {
		display: flex;
		align-items: center;
		padding: 20rpx;
		background: #f8f9fa;
		border-radius: 8rpx;
		margin-bottom: 15rpx;
		border: 1rpx solid #e9ecef;
	}

	.part-info {
		flex: 1;
		margin-right: 20rpx;
	}

	.part-name {
		display: block;
		font-size: 28rpx;
		font-weight: 500;
		color: #333;
		margin-bottom: 8rpx;
	}

	.part-no {
		display: block;
		font-size: 24rpx;
		color: #666;
		margin-bottom: 5rpx;
	}

	.part-spec {
		display: block;
		font-size: 24rpx;
		color: #666;
		margin-bottom: 5rpx;
	}

	.part-type {
		display: block;
		font-size: 24rpx;
		color: #666;
		margin-bottom: 5rpx;
	}

	.part-stock {
		display: block;
		font-size: 24rpx;
		color: #999;
	}

	.part-quantity {
		display: flex;
		align-items: center;
		gap: 10rpx;
	}

	.quantity-label {
		font-size: 24rpx;
		color: #666;
		margin-right: 10rpx;
	}

	.quantity-btn {
		width: 60rpx;
		height: 60rpx;
		border-radius: 50%;
		border: 1rpx solid #ddd;
		background: white;
		font-size: 24rpx;
		color: #333;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.quantity-btn:active {
		background: #f0f0f0;
	}

	.quantity-input {
		width: 100rpx;
		height: 60rpx;
		text-align: center;
		border: 1rpx solid #ddd;
		border-radius: 8rpx;
		font-size: 24rpx;
		background: white;
	}

	.no-parts-tip {
		text-align: center;
		padding: 40rpx 20rpx;
		background: #f8f9fa;
		border-radius: 8rpx;
		border: 1rpx dashed #ddd;
	}

	.tip-text {
		font-size: 26rpx;
		color: #999;
	}
	
	/* 维修信息卡片样式 */
	.repair-info-card {
		background: white;
		border-radius: 12rpx;
		box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
		margin-bottom: 20rpx;
		overflow: hidden;
	}
	
	.repair-header {
		background: #f8f9fa;
		padding: 24rpx 32rpx;
		border-bottom: 1rpx solid #e9ecef;
	}
	
	.repair-title {
		font-size: 32rpx;
		font-weight: 600;
		color: #333;
	}
	
	.repair-content {
		padding: 32rpx;
	}
	
	.repair-field {
		display: flex;
		align-items: flex-start;
		margin-bottom: 24rpx;
		padding-bottom: 24rpx;
		border-bottom: 1rpx solid #f0f0f0;
	}
	
	.repair-field:last-child {
		border-bottom: none;
		margin-bottom: 0;
		padding-bottom: 0;
	}
	
	.repair-field-full {
		flex-direction: column;
		align-items: flex-start;
	}
	
	.repair-label {
		font-size: 28rpx;
		color: #666;
		width: 160rpx;
		flex-shrink: 0;
		margin-right: 20rpx;
	}
	
	.repair-value {
		font-size: 28rpx;
		color: #333;
		flex: 1;
		word-break: break-all;
	}
	
	.repair-value-full {
		margin-top: 8rpx;
		line-height: 1.5;
	}
</style>

